import React from 'react';

import { Brain } from 'lucide-react';

const AiIcon = ({ size = 24, className = '' }) => (
    <svg
        xmlns="http://www.w3.org/2000/svg"
        width={size}
        height={size}
        viewBox="0 0 24 24"
        fill="none"
        stroke="currentColor"
        strokeWidth="2"
        strokeLinecap="round"
        strokeLinejoin="round"
        className={`lucide lucide-brain-circuit ${className}`}
    >
        <path d="M12 5a3 3 0 1 0-5.993 1.175" />
        <path d="M17.61 6.165A3 3 0 1 0 12.007 11" />
        <path d="M12 11a3 3 0 1 0 5.993-1.175" />
        <path d="M5.993 12.825A3 3 0 1 0 11.995 18" />
        <path d="M12.007 13A3 3 0 1 0 17.61 17.835" />
        <path d="M12 18a3 3 0 1 0-5.993-1.175" />
        <path d="M21 12h-2" />
        <path d="M3 12h2" />
        <path d="M12 3V1" />
        <path d="M12 23v-2" />
        <path d="m4.929 4.929-.707-.707" />
        <path d="m19.778 19.778-.707-.707" />
        <path d="m4.929 19.071.707-.707" />
        <path d="m19.778 4.222.707-.707" />
    </svg>
);

export const AiSummaryCard = ({ description }: { description: string }) => {
    // 如果没有 description，则不渲染组件
    if (!description) {
        return null;
    }
    // 如果 description 为空字符串，则不渲染组件
    if (description.trim() === '') {
        return null;
    }
    return (
        <div className="bg-[#231639] p-4 sm:p-6 rounded-xl shadow-lg">
            <div className="flex justify-between items-center mb-4">
                <div className="flex items-center">
                    <div className="bg-[#895ee6] text-gray-50 w-6 h-6 rounded-full flex items-center justify-center mr-3">
                        <Brain className="w-4 h-4" />
                    </div>
                    <span className="text-gray-50 font-semibold text-base">AI 生成的摘要</span>
                </div>
                <div className="text-[11px] text-gray-400 flex items-center">
                    <span className="w-1.5 h-1.5 bg-[#A08FC0] rounded-full mr-2"></span>
                    此内容由 AI 生成
                </div>
            </div>
            <p className="text-[#D9D0E9] text-sm leading-relaxed">{description || ''}</p>
        </div>
    );
};

export default AiSummaryCard;
